之前使用插件禁止谷歌字体,但现在觉得自己博文的字体很丑,到了不能忍的地步,于是决定花些时间解决谷歌字体。

1. 问题描述

因谷歌服务在国内无法正常使用。之前了解到,禁用谷歌字体会提升加载速度(但牺牲美观),于是我用了如下两个插件。

  • Remove Open Sans font from WP core
  • Disable Google Fonts

但现在觉得自己博文的字体很丑,到了不能忍的地步,于是决定花些时间解决谷歌字体。

2. 解决方法

方法1:从自已服务器加载字体

将谷歌相关字体下载到自已服务器,详情可参考Solagirl的博文:

方法2:使用插件googlefontsto360

该插件将谷歌字体相关链接替换成国内360提供的CDN链接。

方法3:替换Google免费字体库的地址

思路跟方法2一样,只是这里直接修改WordPress源代码,替换Google免费字体库的地址,即替换wordpress/wp-includes/script-loader.php文件中的open_sans_font_url,如下:

$open_sans_font_url = "https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,300,400,600&subset=$subsets";

//替换成 ( https://fonts.googleapis.com --> http://fonts.useso.com )
$open_sans_font_url = "http://fonts.useso.com/css?family=Open+Sans:300italic,400italic,600italic,300,400,600&subset=$subsets";

值得注意的是,https要改成http,否则有错误“Failed to load resource: net::ERR_INSECURE_RESPONSE”(通过Inspect element查看)。我看了下方法2插件googlefontsto360的源码,没将https改成http,估计有问题。这种方法直接修改WordPress内核,一旦WordPress升级,又得手动修改,甚是麻烦。

方法4:使用wp-enqueue_style

使用wp_enqueue_style引入360 CDN Google字体库,即在functions.php添加如下代码(不知道这样是否可行,需要先禁用默认的open sans?):

// enqueue google fonts
function add_google_fonts() {
    wp_enqueue_style( 'google-fonts','http://fonts.useso.com/css?family=Open+Sans:300,400,600&subset=latin,latin-ext', false );
}

add_action( 'wp_enqueue_scripts', 'add_google_fonts');

参考资料:

[1] Blog: How to Add Google Web Fonts in WordPress Themes the “Right” way

本文系Spark & Shine原创,转载需注明出处本文最近一次修改时间 2022-04-17 17:11

results matching ""

    No results matching ""